<h3>描述</h3>
<p>表格单选功能需要配合tiRadio组件来实现，具体可参考tiRadio组件的使用说明。使用单选时， 需要给单选框对应列(th,td)加 radio-column 属性。</p>
<p class="demo-text-warn">注意：使用 tiRadio 组件，请导入 TiRadioModule；使用 tiOverflow 组件，请导入 TiOverflowModule。</p>
<h3>示例</h3>

<ti-table [(displayedData)]="displayed" [srcData]="srcData" [columns]="columns" (stateUpdate)="stateUpdate($event)">
  <table>
    <thead>
      <tr>
        <!--使用单选框时，需要给单选框列加 radio-column 属性-->
        <th radio-column></th>
        <th tiOverflow>{{columns[1].title}}</th>
        <th tiOverflow>{{columns[2].title}}</th>
        <th tiOverflow>{{columns[3].title}}</th>
        <th tiOverflow>{{columns[4].title}}</th>
      </tr>
    </thead>
    <tbody>
      <!--注意:ngFor中的displayed数据与displayedData传入的数据一致, 初始化设置为[]即可-->
      <!--为了更好的渲染性能，建议在ngFor数据时总是trackBy数据条目中的某个唯一属性值(如id)-->
      <tr
        *ngFor="let row of displayed;index as i;trackBy: trackByFn"
        [ngClass]="{
                    'ti3-selected-tr': selectedValue === row.id}"
      >
        <!--使用单选框时，需要给单选框列加 radio-column 属性-->
        <!--从10.1.2版本开始，点击radio所在的单元格可以选中或者取消选中，
                    并且可以使用ti3-disabled-cell为单元格添加禁用样式-->
        <td
          radio-column
          [ngClass]="{
                    'ti3-disabled-cell': row.disabled}"
        >
          <!--此处使用的是tiRadio组件，具体用法可参考tiRadio组件-->
          <!-- 确保翻页后还能保持选中状态，[value]绑定为记录的唯一标识 -->
          <input type="radio" [disabled]="row.disabled" tiRadio [(ngModel)]="selectedValue" [value]="row.id" />
        </td>
        <td tiOverflow>{{row.lastName}}</td>
        <td tiOverflow>{{row.age}}</td>
        <td tiOverflow>{{row.balance | currency}}</td>
        <td tiOverflow>{{row.email}}</td>
      </tr>
    </tbody>
  </table>
  <ti-pagination [(currentPage)]="currentPage" [pageSize]="pageSize" [(totalNumber)]="totalNumber"> </ti-pagination>
</ti-table>
